<!DOCTYPE html>
<html lang="en">

<head>
  <meta charset="UTF-8">
  <meta http-equiv="X-UA-Compatible" content="IE=edge">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <title>then</title>
</head>

<body>
  <script>
    'use strict'
    onload = function () {

      // then 可以接受两个回调函数作为参数，分别用来处理 Promise 实例的成功与失败状态(一般情况下只传一个回调函数，用于处理成功状态)

      // then 的返回值
      //  1.promise.then() 默认返回一个成功状态的 promise 值为 then 中回调函数的返回值
      //  2.then 中回调函数的返回值为一个新的 promise 实例 then 方法的返回一个状态与该 promise 实例相同的 promise 实例
      //  3.then 中有异常抛出但未进行处理，返回值为一个失败状态的 promise 值为错误对象
      //  4.当 then 中没有处理调用 then 的 promise 实例的函数时,当前的 promise 实例直接穿透

      // catch 接受一个回调函数作为参数，用来处理 Promise 实例的失败状态
      // catch 的返回值
      //  1.catch方法的返回值规则和then保持一致

      const promise = new Promise((resolve, reject) => {
        console.log('请求发送中......')
        try {
          // 抛出异常
          throw new Error('失败')
          // 模拟请求
          setTimeout(() => {
            console.log('请求成功')
            resolve({
              username: '于谦',
              hobby: ['抽烟', '喝酒', '烫头']
            })
          }, 2000)
        } catch (error) {
          reject(error.message)
        }
      })

      const p = promise.then((result) => {
        console.log(result)
        return new Promise((resolve, reject) => {
          console.log('请求发送中......')
          try {
            // 抛出异常
            
            // 模拟请求
            setTimeout(() => {
              console.log('请求成功')
              resolve({
                username: '坤坤',
                hobby: ['唱', '跳', 'rap', '篮球']
              })
            }, 2000)
          } catch (error) {
            reject(error.message)
          }
        })
      }).then((result) => {
        console.log(result)
      }).catch((err) => {
        console.log(err)
        return '123'
      })

      console.log('promise', promise)
      console.log('p', p)
    }
  </script>
</body>

</html>